<template>
  <div class="hello">
   <headt headtTxl='通讯录' customFixed>
     <button slot='fh'>返回</button>
      <button slot='zy'>主页</button>
   </headt>
   <list :userData='userData'></list>
   </div>
</template>
<script>
import headt from '@/components/headt'
import list from '@/components/list'
export default {
  name: 'HelloWorld',
  components:{headt,list},
  data () {
    return {
      msg: 'Welcome to Your Vue.js App',
      userData:[
        {
            'index':'A',
            'user':[
                {'name':'a1','tel':'123456789'},
                {'name':'a2','tel':'123456789'},
                {'name':'a3','tel':'123456789'},
            ]
        },
        {
            'index':'B',
            'user':[
                {'name':'b1','tel':'123456789'},
                {'name':'b2','tel':'123456789'},
                {'name':'b3','tel':'123456789'},
            ]
        },
        {
            'index':'C',
            'user':[
                {'name':'c1','tel':'123456789'},
                {'name':'c2','tel':'123456789'},
                {'name':'c3','tel':'123456789'},
            ]
        },
        {
            'index':'D',
            'user':[
                {'name':'d1','tel':'123456789'},
                {'name':'d2','tel':'123456789'},
                {'name':'d3','tel':'123456789'},
            ]
        },
        {
            'index':'E',
            'user':[
                {'name':'e1','tel':'123456789'},
                {'name':'e2','tel':'123456789'},
                {'name':'e3','tel':'123456789'},
            ]
        },
        {
            'index':'F',
            'user':[
                {'name':'f1','tel':'123456789'},
                {'name':'f2','tel':'123456789'},
                {'name':'f3','tel':'123456789'},
            ]
        },
    ]
    }
  }
 
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
